<template>
    <div>
      <el-breadcrumb separator="/">
        <el-breadcrumb-item :to="{ path: '/home' }">首页</el-breadcrumb-item>
        <el-breadcrumb-item>招聘管理</el-breadcrumb-item>
        <el-breadcrumb-item>招聘需求</el-breadcrumb-item>
      </el-breadcrumb>

      <el-card>
        <el-row :gutter="20">
          <el-col :span="6">
            <el-input placeholder="渠道名称" clearable v-model="channelName" @clear="searchChannel">
              <el-button slot="append" icon="el-icon-search" @click="searchChannel"></el-button>
            </el-input>
          </el-col>
          <el-col :span="6">
            <el-input placeholder="渠道类型" clearable v-model="channelType" @clear="searchChannel">
              <el-button slot="append" icon="el-icon-search" @click="searchChannel"></el-button>
            </el-input>
          </el-col>
          <el-col :span="1">
            <el-button type="primary" @click="addChannelFormVisible=true">添加渠道</el-button>
          </el-col>
        </el-row>

        <el-table :data="channelList" border stripe>
          <el-table-column type="index"></el-table-column>
          <el-table-column label="渠道编码" prop="channelId" width="100"></el-table-column>
          <el-table-column label="渠道名称" prop="channelName" ></el-table-column>
          <el-table-column label="渠道类型" prop="channelType"></el-table-column>
          <el-table-column label="渠道状态" prop="channelStatus"></el-table-column>
          <el-table-column label="创建人" prop="createName" width="100"></el-table-column>
          <el-table-column label="创建时间" prop="insertTime"></el-table-column>
          <el-table-column label="更新人" prop="updateName" width="100"></el-table-column>
          <el-table-column label="更新时间" prop="updateTime"></el-table-column>

          <el-table-column label="操作">
            <template slot-scope="scope" >
              <el-button type="warning" size="mini" @click="showEditDialog(scope.row)">编辑</el-button>
              <el-button type="danger" size="mini" @click="removeById(scope.row.id)">删除</el-button>
            </template>
          </el-table-column>
        </el-table>
        <el-pagination
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page="pageNum"
            :page-sizes="[2, 4 , 8, 16]"
            :page-size="pageSize"
            layout="total, sizes, prev, pager, next, jumper"
            :total="total"
        ></el-pagination>
      </el-card>


      <!--  添加渠道菜单-->
      <div>
        <el-dialog title="添加渠道" :visible.sync="addChannelFormVisible" :close-on-click-modal="false">
          <el-form ref="addChannelFormRef" :rules="addChannelFormRules" :model="addChannelFrom" label-width="80px" size="mini">

            <el-form-item label="渠道ID" prop="channelId">
              <el-input v-model="addChannelFrom.channelId"></el-input>
            </el-form-item>
            <el-form-item label="渠道名称" prop="channelName">
              <el-input v-model="addChannelFrom.channelName"></el-input>
            </el-form-item>

            <el-form-item label="渠道类型" prop="channelType">
              <el-input v-model="addChannelFrom.channelType"></el-input>
            </el-form-item>

            <el-form-item label="渠道状态" prop="channelStatus">
              <el-input v-model="addChannelFrom.channelStatus"></el-input>
            </el-form-item>
            <el-form-item label="创建人" prop="createName">
              <el-input v-model="addChannelFrom.createName"></el-input>
            </el-form-item>
<!--            <span class="demonstration">创建时间</span>-->
<!--            <el-date-picker-->
<!--                v-model="insertTime"-->
<!--                type="date"-->
<!--                placeholder="选择日期">-->
<!--            </el-date-picker>-->
            <el-form-item label="修改人" prop="updateName">
              <el-input v-model="addChannelFrom.updateName"></el-input>
            </el-form-item>

<!--            <el-form-item label="修改时间" prop="updateTime">-->
<!--              <el-input v-model="addChannelFrom.updateTime"></el-input>-->
<!--            </el-form-item>-->
          </el-form>

          <div slot="footer" class="dialog-footer">
            <el-button @click="cancelAddChannelDialog">取 消</el-button>
            <el-button type="primary" @click="addChannel">确 定</el-button>
          </div>
        </el-dialog>


        <!--修改渠道-->
        <el-dialog title="修改渠道" :visible.sync="modifyChannelFormVisible" :close-on-click-modal="false">
          <el-form ref="modifyChannelFormRef" :rules="modifyChannelFormRules" :model="modifyChannelFrom" label-width="80px" size="mini">

            <el-form-item label="渠道ID" prop="channelId">
              <el-input v-model="modifyChannelFrom.channelId"></el-input>
            </el-form-item>
            <el-form-item label="渠道名称" prop="channelName">
              <el-input v-model="modifyChannelFrom.channelName"></el-input>
            </el-form-item>

            <el-form-item label="渠道类型" prop="channelType">
              <el-input v-model="modifyChannelFrom.channelType"></el-input>
            </el-form-item>

            <el-form-item label="渠道状态" prop="channelStatus">
              <el-input v-model="modifyChannelFrom.channelStatus"></el-input>
            </el-form-item>
<!--            <el-form-item label="创建人" prop="createName">-->
<!--              <el-input v-model="modifyChannelFrom.createName"></el-input>-->
<!--            </el-form-item>-->
<!--            <el-form-item label="创建时间" prop="insertTime">-->
<!--              <el-input v-model="modifyChannelFrom.insertTime"></el-input>-->
<!--            </el-form-item>-->
            <el-form-item label="修改人" prop="updateName">
              <el-input v-model="modifyChannelFrom.updateName"></el-input>
            </el-form-item>

<!--            <el-form-item label="修改时间" prop="updateTime">-->
<!--              <el-input v-model="modifyChannelFrom.updateTime"></el-input>-->
<!--            </el-form-item>-->
          </el-form>

          <div slot="footer" class="dialog-footer">
            <el-button @click="cancelModifyChannelDialog">取 消</el-button>
            <el-button type="primary" @click="modifyChannel">确 定</el-button>
          </div>
        </el-dialog>
      </div>
    </div>
</template>

<script>
export default {
  name: "RecruitChannel",
  data(){
    return{

      channelName:'',
      insertTime:'',
      channelType:'',
      channelList:[],
      pageNum:1,
      pageSize:2,
      total:0,
      addChannelFormVisible:false,
      // 录入框规则
      addChannelFormRules:{

      },


      //添加数据定义
      addChannelFrom:{
        channelName:'',
        channelType:'',
        channelId:'',
        channelStatus:'',
        createName:'',
        insertTime:'',
        updateName:'',
        updateTime:'',
      },

      //保存规则
      modifyChannelFormRules:{

      },

      modifyChannelFormVisible:false,
      //保存表单
      modifyChannelFrom:{
        channelName:'',
        channelType:'',
        channelId:'',
        channelStatus:'',
        createName:'',
        insertTime:'',
        updateName:'',
        updateTime:'',
      },


    }
  },
  methods:{
    // pickerOptions: {
    //   disabledDate(time) {
    //     return time.getTime() > Date.now();
    //   }
    // },

    //取消添加对话框
    cancelAddChannelDialog(){
      this.addChannelFormVisible = false;
      this.addChannelFrom = {};
    },

    cancelModifyChannelDialog(){
      this.modifyChannelFormVisible = false;
    },
    searchChannel(){
      this.initChannel();
    },
    //弹出修改对话框
    showEditDialog(row){
      this.modifyChannelFrom = row;
      this.modifyChannelFormVisible = true;
    },
    addChannel(){
      let url = this.$HRMSUrl + "/channel/addChannel";
      this.$axios.post(url,this.addChannelFrom).then(
          res=>{
            if (res.data.code == 200){
              this.addChannelFormVisible = false;
              this.addChannelFrom = {};
              this.initChannel();
            }else {
              this.$message({
                type:"error",
                message:res.data.msg,
                duration:1000
              })
            }
          }).catch(error=>{
        this.$message({
          type:"error",
          message:"系统错误，请联系管理员!",
          duration:1000
        })
      })
    },
    //根据ID删除数据
    removeById(id){
      let url = this.$HRMSUrl+"/channel/del/"+id;
      this.$confirm('此操作将永久删除该数据, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.$axios.delete(url)
            .then(res=>{
              if (res.data.code == 200){
                this.initChannel();
              }else {
                this.$message({
                  type:"error",
                  message:res.data.msg,
                  duration:1000
                })
              }
            })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        });
      });
    },
    modifyChannel(){
      let url = this.$HRMSUrl+"/channel/modify";
      this.$axios.put(url,this.modifyChannelFrom)
          .then(res=>{
            if (res.data.code == 200){
              this.modifyChannelFormVisible = false ;
              this.initChannel();
            }else {
              this.$message({
                type:"error",
                message:res.data.msg,
                duration:1000
              })
            }
          }).catch(error=>{
        this.$message({
          type:"error",
          message:"系统错误，请联系管理员!",
          duration:1000
        })
      })
    },
    //选择分页单位，每页几条
    handleSizeChange(size){
      this.pageSize = size;
      this.initChannel();
    },
    //访问当前页
    handleCurrentChange(now){
      this.pageNum = now;
      this.initChannel();
    },
    //初始化讲师数据
    initChannel(){
      let url = this.$HRMSUrl + "/channel/channelList";
      console.log(this.channelName)
      this.$axios.get(url,{
        params:{
          channelName:this.channelName,
          channelType:this.channelType,
          now:this.pageNum,
          size:this.pageSize
        }

      }).then(res=>{
        if (res.data.code == 200){
          this.channelList = res.data.data.list;
          this.pageNum = res.data.data.pageNum;
          this.pageSize = res.data.data.pageSize;
          this.total = res.data.data.total;
        }else {
          this.$message({
            type:"error",
            message:res.data.msg,
            duration:1000
          })
        }
      }).catch(error=>{
        this.$message({
          type:"error",
          message:"系统错误，请联系管理员！",
          duration:1000
        })
      })
    },
  },
  created() {
    this.initChannel();
  },
}
</script>

<style scoped>

</style>